<template>
	<div>
		<div v-if="childOrderList && childOrderList.payType !=9 && childOrderList.payType !=6 && childOrderList.payType !=21">
			<!-- serialNumber表示改单有流水号已完成 -->
			<ul class="aui-list aui-media-list orderInfo" v-if="getOrderBill.data && getOrderBill.data.serialNumber && childOrderList.status === 0">
				<li class="aui-list-item" v-if="!types" style="justify-content: space-between;display: flex;">
					<!-- 开票状态：<span style="margin-left: 0.5rem;">开票中</span> -->
					<div class="aui-list-item-inner" style="text-align: left;display: flex;justify-content: space-between;">
						<p>开票状态：<span>开票中</span></p>
						<span style="color:#9a9a9a;font-size: 0.55rem;" v-if="decideOrderDetail() == -1">
							订单签收后可查看
						</span>
						<span style="color:#9a9a9a;font-size: 0.55rem;" v-if="decideOrderDetail() != -1">
							订单取餐后可查看
						</span>
					</div>
					
				</li>
				<li class="aui-list-item" v-else>
					<div class="aui-list-item-inner" style="text-align: left;">
						<p style="float:left;">开票状态：
							<span v-if="getOrderBill.data.url">已开票</span>
							<span v-if="!getOrderBill.data.url">开票中</span>
						</p>
						<div style="width:60%; pointer-events: initial;float:right;">
							<div class="lookBilly" style="display:inline-block;float:right;" @click.stop="lookupBill(getOrderBill.data,childOrderList)">
								<!-- <a style="color:#9a9a9a;" :href='getOrderBill.url'>查看发票</a> -->
								<span style="color:#9a9a9a;" >查看发票</span>
							</div>
							<div class="setMeaily" v-if="getOrderBill.data.url" style="display:inline-block;float:right;"  @click="setEmail" ><i class="icon njfont nj-youjianyouxiang" style="font-size:0.72rem;"></i>&nbsp;发送邮箱</div>
						</div>
						<div style="clear:both;"></div>
						<div style="display: flex;" v-if="getOrderBill.data.url">
							<p style="line-height:1.2rem;width:90%;">发票抬头：
								<span style="margin-right:0.5rem;" v-if="getOrderBill.data.invoiceTitleType=='1'">{{getOrderBill.data.invoiceTitle}}</span>
								<span style="margin-right:0.5rem;" v-else>{{getOrderBill.data.invoiceTitle}}</span>
								<!-- <span class="aui-font-size-14 text_c_gray"></span> -->
							</p>
						</div>
						<p v-if="getOrderBill.data.url&&getOrderBill.data.invoiceTitleType=='1'">身份证号：<span>{{getOrderBill.data.dutyParagraphNo}}</span></p>
						<p v-if="getOrderBill.data.url&&getOrderBill.data.invoiceTitleType=='2'">税号：<span>{{getOrderBill.data.dutyParagraphNo}}</span></p>

						<p v-if="getOrderBill.data.url">发票内容：<span>{{getOrderBill.data.invoiceContext}}</span></p>
					</div>
				</li>
			</ul>
			<ul class="aui-list aui-media-list" v-if="getOrderBill.data && !getOrderBill.data.serialNumber  && childOrderList.status === 0">
			<!-- <ul class="aui-list aui-media-list" v-if="childOrderList.hasInvoice"> -->
				<li class="aui-list-item" v-if="!types ">
					<!-- 开票状态：<span style="margin-left: 0.5rem;">未开票</span> -->
					<div class="aui-list-item-inner" style="text-align: left;display: flex;justify-content: space-between;">
						<div style="width:38%;font-size:0.7rem;color:#9a9a9a;">开票状态：<span>未开票</span></div>
					
						<span style="color:#9a9a9a;font-size: 0.7rem;" v-if="decideOrderDetail() == -1">
							待签收后查看或补开
						</span>
						<span v-if="decideOrderDetail() != -1" style="color:#9a9a9a;font-size: 0.7rem;">
							待取餐后查看或补开
						</span>
					</div>
				</li>
				<li class="aui-list-item" style="padding-right: 0.5rem;" v-if="types && !judgeTime()">
					<div class="aui-list-item-inner" style="text-align: left;">
						<span style="float: left;line-height: 1.8rem;">
							开票状态：<span style="margin-left: 0.5rem;">未开票</span>
						</span>
						<span v-if="childOrderList.hasInvoice == 0" style="float: right;">
							<div class="aui-btn aui-btn-outlined" @click.stop="exploitBills()">
								开票申请
							</div>
						</span>
					</div>
				</li>
			</ul>
			<!-- <ul class="aui-list aui-media-list" v-if="Status||getOrderBill.returnCode==3||getOrderBill.returnCode==2||childOrderList.status === 2 || judgeTime()">	   	交易已关闭的订单 -->
			<ul class="aui-list aui-media-list" v-if="getOrderBill.returnCode !=1 ||childOrderList.status != 0 || judgeTime()">	  
				<li class="aui-list-item"  v-if="childOrderList.status === 1">
					<div class="aui-list-item-inner" style="text-align: left;display: flex;justify-content: space-between;">     <!-- 	已取消的订单 -->
						<p style="width:40%;font-size:0.7rem;color:#9a9a9a;">发票</p>
						<span style="color:#9a9a9a;font-size: 0.7rem;">
							暂不支持开具发票
						</span>
					</div>
				</li>
				<li class="aui-list-item" v-else>
					<div v-if="!getOrderBill.data && !types&&getOrderBill.returnCode!=3 && childOrderList.status !=2" class="aui-list-item-inner" style="text-align: left;display: flex;justify-content: space-between;">
						<div style="width:38%;font-size:0.7rem;color:#9a9a9a;">开票状态：<span>未开票</span></div>
					
						<span style="color:#9a9a9a;font-size: 0.7rem;" v-if="decideOrderDetail() == -1">
							待签收后查看或补开
						</span>
						<span v-if="decideOrderDetail() != -1" style="color:#9a9a9a;font-size: 0.7rem;">
							待取餐后查看或补开
						</span>
					</div>
					<div v-else-if="types && !judgeTime() && getOrderBill.returnCode!=3 && childOrderList.status !=2" class="aui-list-item-inner" style="text-align: left;">
						<span style="float: left;line-height: 1.8rem;">
							开票状态：<span style="margin-left: 0.5rem;">未开票</span>
						</span>
						<span v-if="childOrderList.hasInvoice == 0" style="float: right;">
							<div class="aui-btn aui-btn-outlined" @click.stop="exploitBills()">
								开票申请
							</div>
						</span>
					</div>
					<div v-else class="aui-list-item-inner" style="text-align: left;display: flex;justify-content: space-between;"> <!-- 	交易已关闭的订单 -->
						<p style="width:40%;font-size:0.7rem;color:#9a9a9a;">发票</p>
						<span style="color:#9a9a9a;font-size: 0.7rem;position:relative;margin-right:1.1rem;">
							电子发票已失效
							<i @click="showCoupon" v-if="decideOrderDetail() != -1" class="icon njfont nj-tishi" style="font-size:1rem;position:absolute;top:-0.1rem;right: -1rem;"></i>
							<i @click="showinintBox" v-if="decideOrderDetail() === -1" class="icon njfont nj-tishi hzh" style="font-size:1rem;position:absolute;top:-0.1rem;right: -1rem;"></i>
						</span>
					</div>
					
				</li>
			</ul>
			<mt-popup ref="BillDetail" v-model="popupVisible" popup-transition="popup-fade" modal="true" closeOnClickModal="true" class="setEmail">
				<Bill-SetEmail  @hideModal="updateType" :orderNos="getOrderBill.data ? getOrderBill.data.orderNo:''" :parentOrderNo = "orderID ? orderID : ''"></Bill-SetEmail>
			</mt-popup>
			<Bill-Hint ref="coupon" v-if="decideOrderDetail() == -1"></Bill-Hint>
		</div>
		<div  class="aui-list aui-media-list" v-if="childOrderList&&(childOrderList.payType===9||childOrderList.payType===6||childOrderList.payType===21)">
			<li class="aui-list-item">
				<div class="aui-list-item-inner" style="text-align: left;display: flex;justify-content: space-between;">
					<p style="width:40%;font-size:0.7rem;color:#9a9a9a;">发票</p>
					<span style="color:#9a9a9a;font-size: 0.7rem;position:relative;margin-right:1.1rem;">
						电子发票已失效
						<i @click="showCoupon" v-if="decideOrderDetail() != -1" class="icon njfont nj-tishi" style="font-size:1rem;position:absolute;top:-0.1rem;right: -1rem;"></i>
						<i @click="showinintBox" v-if="decideOrderDetail() === -1" class="icon njfont nj-tishi hzh" style="font-size:1rem;position:absolute;top:-0.1rem;right: -1rem;"></i>
					</span>
					
				</div>
			</li>
		</div>
		<Bill-Hint ref="coupon"></Bill-Hint>
	</div>
</template>

<script>
	import axios from "axios";
	// import api from "../../api";
	import {Popup, MessageBox} from 'mint-ui';
	import { mapState, mapGetters, mapMutations } from "vuex";
	import BillSetEmail from "../BillSetEmail";
	import BillHint from "../BillHint";
	export default {
		data(){
			return {
				ParentOrderNos:"",
				rids:'',
				types:'',//订单页传过来的number值
				popupVisible : false,
				// hasInvoices:'',//订单传到订单详情的值  是否开过发票
				orderID:'',
				ordStatus:"",//订单状态
				// Status:null,
				orderNo:null,
				orderTypes:true,
				// canInvoiceType:null,
			}
		},
      	props: {
//	      	orderNo: {
//		        type: String,
//	//		        default: () => {
//	//		          return false
//	//		        }
//		        required:true
//		    },
		    // childOrderList: {
		    //     type: [Object],
			// },
			showCoupon:{
				type: Function,
				default:()=>{

				}
			},
			// canInvoiceType:{
			// 	type: Boolean,
				
			// },
			// hasInvoice:{
			// 	type:Number,
			// 	default:()=>{

			// 	}
			// }
	    },
	    computed: {
	    	getBillList() {
                return this.$store.state.hzh.getBillInfor;
            },
            getBillContent() {
                return this.$store.state.hzh.BillContent;
			},
			getOrderBill() {
	//	    	return this.$store.dispatch('hzh/GetOrderBills');//GetOrderBills
				return this.$store.state.hzh.orderBills;
			},
			childOrderList() {
				return this.$store.state.hzh.childOrderList;
			},
	    },
		components:{
			"Bill-SetEmail": BillSetEmail,
			'mt-popup': Popup,
			"BillHint": BillHint,
		},
		watch:{
			
		},
		methods: {
			setEmail() {
	//          this.popupVisible = true;
				MessageBox.prompt('请输入邮箱地址').then(({ value, action }) => {
					//邮箱验证
					var regEmail=/^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
					if(!regEmail.test(value)){
						MessageBox.alert("邮箱格式不正确")
						return;
					}
					var sessionId = localStorage.getItem('sessionId');
					let email = value;
					let parentOrderNo = this.$router.history.current.query.shopId;
					console.log("nihaoa122121",parentOrderNo)
					var url = window.api.trade_host + "/orderElectronicInvoice/sendMail/" + parentOrderNo +"/"+ email;
					var config = {
					url :url,
		//             data:datas,
					method:"PUT",
					headers: {'sessionId': sessionId, 'Content-Type':'application/json', 'Accept' : 'application/json'},
					}
					axios(config).then((res) => {
						console.log("guojilaoa666666666666", res)
						if(res.data.returnCode === 1){
							MessageBox.alert("发送成功").then(action => {
		//					  	this.$store.dispatch('hzh/GetBillheads');//查询发票抬头
		//					  	this.$router.push('/main/HeadManagement');
	//						  	this.deteles();
							});
							
						}else if(res.data.returnCode === 0){
							MessageBox.confirm(res.data.msg)
		//              	.then(action => {
		//	                   this.$router.push('/login');
		//	                });
						}
					
					})
				});
			},
			deteles(){
				console.log("adjashfiasfhia////")
				this.detele = false;
				let data = {
					detele:this.detele,
				}
				this.$emit('hideModal',data);//select事件触发后，自动触发showCityName事件 
			},
			updateType(data) {
				this.popupVisible = data.detele;//改变了父组件的值 
			},
			lookupBill(val,item){
				console.log("dianjile查看发票111",val,item)
				// window.open = val;
				// window.open(val,'_blank','width=7rem,height=10rem,top=1rem,left=0px')
				// window.event.returnValue=false;
				this.$router.push({ path: 'BillParticulars', query: { ParentOrderNo: val.parentOrderNo, orderNo: val.orderNo ,creTime: this.childOrderList.createTm,storeOrderNo:item.storeOrderNo,}})
			},
			//展示提示框
			showinintBox() {
				console.log("sss")
                this.$refs.coupon.showCover()
               
			},
			exploitBills(){
				//跳转到开票申请
				this.$router.push({
					path: 'BillDetail',
					query: { shopId: this.childOrderList.parentOrderNo, datas: this.childOrderList.orderNo , parentOrderNo: this.childOrderList.parentOrderNo}})
			},
			//判断是普通还是堂食订单详情页面
			decideOrderDetail(){
				let path = this.$route.path;
				return path.indexOf("churchOrderDetail");
			},
			//判断方法当前时间减去confirmTm时间是否大于三个月
			judgeTime(){
				let times = this.childOrderList.confirmTm?this.childOrderList.confirmTm:this.childOrderList.payTm
				var timestamp2 =(new Date()).valueOf();
				let timestamp =  timestamp2 - times;
				let taltimestamp = Number((((timestamp/1000)/60)/60)/24);
				console.log("taltimestamp",taltimestamp)
				if(times && taltimestamp > 90 && this.childOrderList.hasInvoice === 0){
					return true
				}else{
					return false
				}
			}
		},
		created(){
			this.ordStatus = this.$route.query.status; 
			if(this.$route.query.orderStatus == 4 || this.ordStatus == "已完成" || this.ordStatus == "待评价" || this.ordStatus== 1){
				this.types = true;
			}else{
				this.types = false;
			}
			this.orderID = this.$route.query.shopId;
			console.log("qixingzhi",this.childOrderList)
			console.log("decideOrderDetail",this.decideOrderDetail(),)
			// if(this.childOrderList.status === 1){
				// this.orderTypes = false; 
			// }
			// if(this.decideOrderDetail() && texts.indexOf("已取消")){
			// 	this.Status = false;
			// }
			// if(this.ordStatus == '交易关闭' ){
			// 	this.Status = true;
			// }else{
			// 	this.Status = false;
			// }
			this.judgeTime();
			// console.log("this.childOrderList",this.childOrderList)
			// console.log("this.decideOrderDetail()",this.decideOrderDetail())
		},
		mounted() {
			
		},
		updated(){
			this.$nextTick(() => {
				setTimeout(()=>{
					
				},500)
			});
			
		}
	}
	
</script>

<style>
	.lookBilly{
		border: 1px solid #E0E0E0;
		/* border-color: #E0E0E0; */
		border-radius: 0.34rem;
		width: 41%;
		height: 1.2rem;
		display: inline-block;
		line-height: 1.2rem;
		text-align: center;
		color:#9a9a9a;
	}
	.setMeaily{
		border: 1px solid #E0E0E0;
		/* border-color: #E0E0E0; */
		border-radius: 0.34rem;
		width: 48%;
		height: 1.2rem;
		display: inline-block;
		line-height: 1.2rem;
		text-align: center;
		color:#9a9a9a;
	}
	.mint-msgbox-wrapper{
		width: 0 !important;
		height: 0 !important;
	}
	.aui-list-item{
		padding-left: 0.5rem !important;
	}
</style>